<template>
  <div>
    <h1>基础用法</h1>
    <br />
    <br />
    <div class="block">
      <span class="demonstration">效果1</span>
      <el-pagination layout="prev, pager, next" :total="50"> </el-pagination>
    </div>
    <br />

    <div class="block">
      <span class="demonstration">效果2</span>
      <el-pagination layout="prev, pager, next" :total="1000"> </el-pagination>
      <br />
      <br />
      <br />

      <h1>效果3</h1>
      <br />
      <el-pagination
        :page-size="20"
        :pager-count="11"
        layout="prev, pager, next"
        :total="1000"
      >
      </el-pagination>
      <br />
      <br />
      <h1>效果4</h1>
      <br />
      <el-pagination background layout="prev, pager, next" :total="1000">
      </el-pagination>
      <br />
      <br />
      <h1>效果5</h1>
      <br />
      <el-pagination small layout="prev, pager, next" :total="50">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: "Pagination",
};
</script>

<style>
</style>